import React from 'react'
//App 父组件   Son子组件
function SonF(props) {
  const { list } = props.state
  const  getSonMsg  = props.getSongMsg
  console.log(props)
  return (
    <>
      <div>我是函数子组件,{props.msg}</div>
      {list.map((o) => (
        <button key={o}  onClick={() => getSonMsg(o)}>
          {o}
        </button>
      ))}
    </>
  )
}
class SonC extends React.Component {
  render() {
    return <div>我是类子组件,{this.props.msg}</div>
  }
}
class App extends React.Component {
  state = {
    message: 'this is message',
    list: [1, 2, 3],
  }

  getSonMsg = (o) => {
    console.log(o)
  }
  render() {
    return (
      <div>
        <SonF
          msg={this.state.message}
          state={this.state}
          getSongMsg={this.getSonMsg}
        ></SonF>
        <SonC msg={this.state.message}></SonC>
      </div>
    )
  }
}

export default App
